<template>
  <q-card class="no-shadow" bordered>
    <q-item>
      <q-item-section avatar>
        <q-avatar size="70px">
          <img :src="avatar" />
        </q-avatar>
      </q-item-section>

      <q-item-section>
        <q-item-label>{{ name }}</q-item-label>
        <q-item-label caption>
          {{ des }}
        </q-item-label>
      </q-item-section>

      <q-item-section side>
        <q-btn
          label="开除"
          size="sm"
          class="bg-indigo-8 text-capitalize text-white"
        ></q-btn>
      </q-item-section>
    </q-item>
  </q-card>
</template>

<script setup lang="ts">
interface Props {
  avatar: string;
  name: string;
  des: string;
}
withDefaults(defineProps<Props>(), {});
</script>

<style scoped></style>
